body ul,li{
    list-style:none;
    margin:0px;
    padding:0px;
}
body dt,dl,dd{
    margin:0px;
    padding:0px;
}
.main{
    display:block;
    clear:both;
    width:80%;
    height:680px;
    margin:10px auto;
    background-color:#DDD;
}
.main_left{
    display:block;
    float:left;
    width:25%;
    height:600px;
    background-color:#CCC;
    margin:20px;
    overflow:hidden;
    overflow-y:auto;
}
.main_left li{
    -webkit-user-select:none;
    user-select:none;
}
.main_left ul li strong{
    color:#333;
    margin-left:10px;
    -webkit-animation:gogogo 3s infinite linear ;
}
.main_left ul li strong:hover{
    color:#FFF;
}
.level_one{
    display:block;
    clear:both;
    width:80%;
    height:auto;
    overflow:hidden;
    margin:0px;
    padding:5px;
}
.leval_two{
    display:block;
    clear:both;
    width:80%;
    height:auto;
    overflow:hidden;
    margin-left:20px;
}
.leval_three{
    display:block;
    clear:both;
    width:80%;
    height:auto;
    overflow:hidden;
    margin-left:20px;
}
body ul li{
    display:block;
    clear:both;
    width:100%;
    overflow:hidden;
    cursor: pointer;
}
body ul li span{
    display:none;
    float:left;
    width:20px;
    height:20px;
    color:#EEE;
    line-height:22px;
    margin-right:3px;
    -webkit-user-select:none;
    user-select:none;
    text-align: center;
    border-radius: 20px;
}
body ul li span.active{
    display:block;
}
.main_center{
    display:block;
    float:left;
    width:65%;
    height:600px;
    background-color:#EEE;
    margin:20px;
}
.option{
    display:block;
    clear:both;
    width:95%;
    height:280px;
    margin:10px auto;
    background-color:#FFF;
    overflow:hidden;
}
.appoint{
    display:block;
    clear:both;
    width:95%;
    height:280px;
    margin:10px auto;
    background-color:#FFF;
    overflow:hidden;
}
.option dt,.appoint dt{
    display:block;
    clear:both;
    width:100%;
    height:30px;
    overflow:hidden;
    line-height:30px;
    font-size:15px;
    color:#333;
    padding:2px 10px;
    background-color:#CCC;
}
.option dt span,.appoint dt span{
    display:block;
    float:left;
    width:20px;
    height:30px;
    line-height:30px;
    overflow:hidden;
    cursor: pointer;
    -webkit-user-select:none;
    user-select:none;
}
.option dt strong{
    display:block;
    float:right;
    width:30px;
    height:30px;
    text-align: center;
    line-height:30px;
    border-radius: 30px;
    color: #E4100C;
    margin-right:5%;
    font-weight: 500;
    -webkit-user-select:none;
    user-select:none;
    cursor: pointer;
}
@-webkit-keyframes gogogo {
    0%{
        margin-left:13px;
    }
    50%{
        margin-left:7px;
    }
    100%{
        margin-left:13px;
    }
}
.appoint dd,.option dd{
    display:block;
    clear:both;
    width:100%;
    height:240px;
    overflow:hidden;
    overflow-y:auto;
    overflow-x:hidden;
    padding:5px 10px;
}
.appoint dd span{
    display:block;
    float:left;
    width:auto;
    padding-left:10px;
    overflow:hidden;
    height:30px;
    line-height:30px;
    text-align: center;
    background-color:#DDD;
    color:#333;
    margin-right:10px;
    margin-bottom:10px;
}
.appoint dd span strong{
    display:block;
    float:right;
    width:auto;
    padding:5px 5px;
    overflow:hidden;
    height:30px;
    line-height:22px;
    text-align: center;
    background-color:#DDD;
    font-size:20px;
    cursor: pointer;
    margin-left:5px;
    -webkit-user-select:none;
    user-select:none;
}
.appoint dd span strong:hover{
    background-color:#666;
    color:red;
}
.option dd span{
    display:block;
    float:left;
    width:auto;
    padding:0px 10px;
    overflow:hidden;
    height:30px;
    line-height:30px;
    text-align: center;
    background-color:#DDD;
    color:green;
    cursor: pointer;
    margin-right:10px;
    margin-bottom:10px;
}
#jsAnima{
    display:block;
    clear:both;
    width:50%;
    height:300px;
    position: absolute;
    z-index: 100000;
    bottom:0px;
    left:0px;
}

#frameBor{
    display:none;
    clear:both;
    width:100%;
    height:770px;
    overflow:hidden;
    position: absolute;
    z-index: 10000000;
    top:0px;
    background:rgba(30,10,25,0.3);
}
#noClose{
    display:block;
    clear:both;
    width:50px;
    height:50px;
    overflow:hidden;
    margin:0px auto;
    border-radius:50px;
    -webkit-animation:sub 6s infinite linear ;
    position: absolute;
    z-index: 1000000;
    top:670px;
    left:48%;
}
@-webkit-keyframes sub {
    0%{
        transform: rotate(30deg);
        -ms-transform: rotate(30deg);		/* IE 9 */
        -webkit-transform: rotate(30deg);	/* Safari and Chrome */
        -o-transform: rotate(30deg);		/* Opera */
        -moz-transform: rotate(30deg);		/* Firefox */
        border:3px dashed #FFF;
    }
    50%{
        transform: rotate(180deg);
        -ms-transform: rotate(180deg);		/* IE 9 */
        -webkit-transform: rotate(180deg);	/* Safari and Chrome */
        -o-transform: rotate(180deg);		/* Opera */
        -moz-transform: rotate(180deg);		/* Firefox */
        border:3px dashed #0099CC;
    }
    100%{
        transform: rotate(360deg);
        -ms-transform: rotate(360deg);		/* IE 9 */
        -webkit-transform: rotate(360deg);	/* Safari and Chrome */
        -o-transform: rotate(360deg);		/* Opera */
        -moz-transform: rotate(360deg);		/* Firefox */
        border:3px dashed #CCCCCC;
    }
}

#closeSpan{
    display:block;
    clear:both;
    width:40px;
    height:40px;
    overflow:hidden;
    margin:10px;
    line-height:40px;
    color:#FF9966;
    text-align: center;
    position: absolute;
    z-index: 10000000;
    top:670px;
    left:48%;
    font-size:30px;
    cursor: pointer;
}
#closeSpan:hover{
    color:red;
}
#confButton{
    cursor: pointer;
    -webkit-user-select:none;
    user-select:none;
}
#confButton:hover{
    color:green;
}